<!doctype html>
<html>
<!-- 已废弃 并整合到licai_hqlc页面中 -->
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="./css/aui.css" />
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
    <link rel="stylesheet" type="text/css" href="./css/percircle.css" />
    <script type="text/javascript" src="./script/jquery.min.js"></script>
    <script type="text/javascript" src="./script/doT.min.js"></script>
    <script type="text/javascript" src="./script/base.js"></script>
    <script type="text/javascript" src="./script/api.js"></script>
</head>

<body>
    <header class="aui-bar aui-bar-nav">
        <div class="aui-title">优质债券</div>
    </header>
    <div class="aui-bar-nav-d"></div>

    <style>
        body {
            background: #fff;
        }
    </style>
    <ul class="licai-nav">
        <li tapmode onclick="licai_hqlc()">活期理财</li>
        <li tapmode onclick="licai_znlc()">智能理财</li>
        <li class="active">优质债券</li>
    </ul>
    <div id="list"></div>
    <!-- <ul class="licai-yzzq"> -->
    <!-- <li tapmode onclick="">
        <div class="licai-yzzq-l">
            <div class="licai-yzzq-l-t">
                <span class="green">每日付息</span>
                <span class="red">随时赎回</span>
                <h2>金车赢JSDY20180408003<img src="image/licai-znlc.png"></h2>
            </div>
            <div class="licai-yzzq-l-d">
                <div class="licai-yzzq-l-d-l">
                    <h2>11.40% <span>+0.8%</span></h2>
                    预期年化收益
                </div>
                <div class="licai-yzzq-l-d-r">
                    <p>15个月</p>
                    每月付息,到期还本
                </div>
            </div>
        </div>
        <div class="licai-yzzq-r">
            <div id="pinkcircle" class="c100 p30 small green">
                <span>30%</span>
                <div class="slice">
                    <div class="bar"></div>
                    <div class="fill"></div>
                </div>
            </div>
            <p>剩余80,000.00元</p>
        </div>
        <div class="licai-yzzq-r-no">
            <img src="image/licai-znlc-off-4.png">
        </div>
        </li> -->
    <!-- <li class="off">
            <div class="licai-yzzq-l">
                <div class="licai-yzzq-l-t">
                    <h2>金车赢JSDY20180408003<img src="image/licai-znlc.png"></h2>
                </div>
                <div class="licai-yzzq-l-d">
                    <div class="licai-yzzq-l-d-l">
                        <h2>11.40%<span>+0.8%</span></h2> 预期年化收益
                    </div>
                    <div class="licai-yzzq-l-d-r">
                        <p>15个月</p>
                        每月付息,到期还本
                    </div>
                </div>
            </div>
            <div class="licai-yzzq-r-no">
                <img src="image/licai-znlc-off-4.png">
            </div>
        </li>
    </ul>

    <div class="foot-t"></div>
    <ul class="foot">
        <li tapmode>
            <img src="image/foot-1.png" onclick="index()">
            <p onclick="index()">首页</p>
        </li>
        <li class="active" tapmode>
            <img src="image/foot-2-h.png" onclick="licai_hqlc()">
            <p onclick="licai_hqlc()">理财</p>
        </li>
        <li tapmode>
            <img src="image/foot-3.png" onclick="user()">
            <p onclick="user()">我的</p>
        </li>
        <li tapmode>
            <img src="image/foot-4.png" onclick="more()">
            <p onclick="more()">更多</p>
        </li> -->
    <!-- </ul> -->
</body>

<script type="text/template" id="template">
    <ul class="licai-yzzq">
        {{~it:value:index}}
        <li class="off">
            <div class="licai-yzzq-l">
                <div class="licai-yzzq-l-t">
                    <h2>{{=value.name}}{{=value.deal_sn}}{{? value.is_hot==1}}
              <img src="image/licai-znlc.png">
              {{??}}{{?}}</h2>
                </div>
                <div class="licai-yzzq-l-d">
                    <div class="licai-yzzq-l-d-l">
                        <h2>{{=value.rate}}
                          {{? value.add_rate==0}}{{??}}<span>+{{=value.add_rate}}%</span>{{?}}</h2> 预期年化收益
                    </div>
                    <div class="licai-yzzq-l-d-r">
                        <p>{{=value.repay_time}}个月</p>
                        {{? value.loantype==0}}等额本息{{?? value.loantype==1}}每月付息，到期还本{{?? value.loantype==2}}到期还本息{{?? value.loantype==3}}先息后本{{??}}{{?}}
                    </div>
                </div>
            </div>
            <div class="licai-yzzq-r-no">
                <img src="image/licai-znlc-off-4.png">
            </div>
        </li>
        {{~}}
    </ul>
</script>
<script type="text/javascript">
    // 圆形进度条
    $(function() {
        var rotationMultiplier = 3.6;
        $("div[id$='circle']").each(function() {
            var classList = $(this).attr('class').split(/\s+/);
            for (var i = 0; i < classList.length; i++) {
                if (classList[i].match("^p")) {
                    var rotationPercentage = classList[i].substring(1, classList[i].length);
                    var rotationDegrees = rotationMultiplier * rotationPercentage;
                    $('.c100.p' + rotationPercentage + ' .bar').css({
                        '-webkit-transform': 'rotate(' + rotationDegrees + 'deg)',
                        '-moz-transform': 'rotate(' + rotationDegrees + 'deg)',
                        '-ms-transform': 'rotate(' + rotationDegrees + 'deg)',
                        '-o-transform': 'rotate(' + rotationDegrees + 'deg)',
                        'transform': 'rotate(' + rotationDegrees + 'deg)'
                    });
                }
            }
        });
    });

    apiready = function() {
        load_list();
        addObserver();
        down_refresh();
    }

    function index() {
        var delay = 0;
        if (api.systemType != 'ios') {
            // delay = 300;
        }
        api.openWin({
            name: 'index',
            url: './index.html',
            bounces: false,
            delay: delay,
            slidBackEnabled: true,
            vScrollBarEnabled: false,
            progress: {
                type: "page"
            }
        });
    };

    function licai_hqlc() {
        var delay = 0;
        if (api.systemType != 'ios') {
            // delay = 300;
        }
        api.openWin({
            name: 'licai_hqlc',
            url: './licai_hqlc.html',
            bounces: false,
            delay: delay,
            slidBackEnabled: true,
            vScrollBarEnabled: false,
            progress: {
                type: "page"
            }
        });
    };

    function licai_znlc() {
        var delay = 0;
        if (api.systemType != 'ios') {
            // delay = 300;
        }
        api.openWin({
            name: 'licai_znlc',
            url: './licai_znlc.html',
            bounces: false,
            delay: delay,
            slidBackEnabled: true,
            vScrollBarEnabled: false,
            progress: {
                type: "page"
            }
        });
    };

    function user() {
        var delay = 0;
        if (api.systemType != 'ios') {
            // delay = 300;
        }
        api.openWin({
            name: 'user',
            url: './user.html',
            bounces: false,
            delay: delay,
            slidBackEnabled: true,
            vScrollBarEnabled: false,
            progress: {
                type: "page"
            }
        });
    };

    function more() {
        var delay = 0;
        if (api.systemType != 'ios') {
            // delay = 300;
        }
        api.openWin({
            name: 'more',
            url: './more.html',
            bounces: false,
            delay: delay,
            slidBackEnabled: true,
            vScrollBarEnabled: false,
            progress: {
                type: "page"
            }
        });
    };

    function yzzq_buy() {
        var delay = 0;
        if (api.systemType != 'ios') {
            // delay = 300;
        }
        api.openWin({
            name: 'yzzq_buy',
            url: './yzzq_buy.html',
            bounces: false,
            delay: delay,
            slidBackEnabled: true,
            vScrollBarEnabled: false,
            progress: {
                type: "page"
            }
        });
    };

    function closeWin() {
        api.closeWin({});
    }

    function load_list(n) {

        api.showProgress({
            style: 'default',
            animationType: 'fade',
            title: '努力加载中...',
            text: '先喝杯茶...',
            modal: false
        });
        if (n) {
            page += 1;
        } else {
            page = 1;
        }
        api.ajax({
            url: webAddress + '/index.php?ctl=app_deal&act=deal_list&page=' + page,
            method: 'get',

        }, function(ret, err) {
            if (ret) {
                // alert(JSON.stringify(ret));
                if (ret.status == 0) {
                    alert(ret.info);
                } else if (ret.status == 1) {
                    updateList(ret.deal.list, ret.deal.min_money);
                }
                api.refreshHeaderLoadDone();
                api.hideProgress();
            }
        });
    }

    function addObserver() {
        api.addEventListener({
            name: 'scrolltobottom',
            extra: {
                threshold: 0
            }
        }, function(ret, err) {

            load_list(true);
        });
    }

    // 下拉刷新
    function down_refresh() {

        api.setRefreshHeaderInfo({
            visible: true,
            // loadingImg: 'widget://image/refresh.png',
            bgColor: '#ccc',
            textColor: '#fff',
            textDown: '下拉刷新...',
            textUp: '松开刷新...',
            showTime: true
        }, function(ret, err) {
            page = 1;
            load_list();
        });
    }

    function updateList(data, num) {

        var template = $api.byId('template');
        var dotFn = doT.template(template.innerHTML);
        var html = dotFn(data);
        var list = $api.byId('list');
        if (page == 1) {
            $api.html(list, html);
        } else {

            if (!data) {
                api.toast({
                    msg: '没有更多了',
                    duration: 2000,
                    location: 'bottom'
                });
                return;
            }
            $api.append(list, html);
        }
        api.parseTapmode();
        // document.getElementById('num3').innerHTML = outputmoney(num).substr(0, outputmoney(num).length-3)+'元起投';
    }
</script>

</html>
